<template>
    <div>
        <h1 style="text-align: center">经销商表</h1>
    <el-table ref="singleTable" v-loading="loading" :data="tableData" stripe
              style="margin-top: 15px" @selection-change="selsChange">
        <el-table-column
                type="selection"
                width="55" >
        </el-table-column>
<!--        <el-table-column label="#" type="index" width="60"></el-table-column>-->
        <el-table-column
                prop="tid"
                label="经销商ID"
                width="120">
        </el-table-column>
        <el-table-column
                fixed
                prop="tradername"
                label="用户名"
                width="150">
        </el-table-column>

        <el-table-column
                prop="realName"
                label="姓名"
                width="120">
        </el-table-column>
        <el-table-column
                prop="password"
                label="密码"
                width="120">
        </el-table-column>
        <el-table-column
                prop="linkman"
                label="联系人"
                width="120">
        </el-table-column>
        <el-table-column
                prop="traderPhone"
                label="电话"
                width="160">
        </el-table-column>
        <el-table-column
                prop="traderMail"
                label="邮箱"
                width="160">
        </el-table-column>
        <el-table-column
                prop="traderStatus"
                label="状态"
                width="100">
        </el-table-column>
        <el-table-column
                prop="ps"
                label="备注"
                width="150">
        </el-table-column>
    </el-table>
        <el-pagination
                background
                layout="prev, pager, next"
                :page-size="5"
                @current-change="page"
                :total="total">
        </el-pagination>
    <el-button @click="deleteFileOrDirectory(sels)" :disabled="this.sels.length === 0"> 批量删除</el-button>
    </div>
</template>

<script>
    export default {
        methods:{
            selsChange(sels) {
                this.sels = sels
            },
            page(currentPage){
                var that = this;
                axios.get('http://localhost:8080/ocp/trader/findAll?page_num='+currentPage).then(function (resp) {
                    console.log(resp);
                    that.tableData = resp.data.rows;
                    that.total=resp.data.total;
                })
            },
            deleteFileOrDirectory() {
                var ids = this.sels.map(item => item.id).join();//获取所有选中行的id组成的字符串，以逗号分隔
                console.log(ids);
                this.$confirm('此操作将永久删除该文件及其子文件, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    let tids=[];
                    for(let i=0;i<this.sels.length;i++){
                        tids.push(this.sels[i].tid);
                    }
                    console.log(tids);
                    axios.post('http://localhost:8080/ocp/trader/deletes',tids).then(function (resp) {
                        console.log(resp.data);
                    })
                })
            }

        },
        data(){
            return{
                total:null,
                tableData: null,
                sels: [],//选中的值显示
            }
        },
        created () {
            var that = this;
            axios.get('http://localhost:8080/ocp/trader/findAll').then(function (resp) {
                console.log(resp);
                that.tableData = resp.data.rows;
                that.total=resp.data.total;
            })
        }
    }
</script>

<style scoped>

</style>
